'use client'

import { useState, useEffect } from 'react';
import { ComponentConfig } from '@/components/ComponentRenderer';
import { globalsData } from '../components/ConditionalLayout';

interface UsePageDataReturn {
  components: ComponentConfig[];
  loading: boolean;
  error: string | null;
  refetch: () => void;
}

export function usePageData(pageId: number): UsePageDataReturn {
  const [components, setComponents] = useState<ComponentConfig[]>([]);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState<string | null>(null);
  const fetchAllPages = async () => {
    try {
      const response = await fetch('/api/page_manage');
      const result = await response.json();

      if (result.success) {
        console.log('所有页面数据:', result.data);
        globalsData.data = result.data;
        // 这里可以根据需要处理所有页面数据
        // 例如存储到 context 或其他状态管理中
      } else {
        console.error('获取所有页面失败:', result.error);
      }
    } catch (error) {
      console.error('获取所有页面数据时出错:', error);
    }
  };

  // 获取页面组件数据
  const fetchPageData = async () => {
    try {
      setLoading(true);
      setError(null);

      if (!globalsData.data) {
        await fetchAllPages();
      }

      // 从 globalsData 中过滤获取指定 id 的页面数据
      if (globalsData.data && Array.isArray(globalsData.data)) {
        const page = (globalsData.data as any[]).find((p: any) => p.id === pageId);

        if (page) {
          try {
            const content = JSON.parse(page.content);
            if (Array.isArray(content)) {
              setComponents(content);
            } else {
              setComponents([]);
            }
          } catch (parseError) {
            console.error('解析页面内容失败:', parseError);
            setComponents([]);
          }
        } else {
          setError(`页面 ID ${pageId} 不存在`);
          setComponents([]);
        }
      } else {
        setError('全局数据未加载或格式错误');
        setComponents([]);
      }
    } catch (fetchError) {
      console.error('获取页面数据时出错:', fetchError);
      setError('获取页面数据时出错');
    } finally {
      setLoading(false);
    }
  };

  // 组件挂载时获取数据
  useEffect(() => {
    fetchPageData();
  }, [pageId]);

  return {
    components,
    loading,
    error,
    refetch: fetchPageData
  };
}
